<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <!--
        1.条件渲染指令
        v-if
        v-else
        v-show
        2.比较v-if和v-show如果需要频繁切换那就使用v-show 节省运行空间
    -->
    <div id="demo">
        <p v-if="ok">成功</p>
        <p v-else>失败</p>

        <p v-show="ok">胜</p>
        <p v-show="!ok">负</p>
        <button @click = "ok=!ok">切换</button>
    </div>
    <script src="../js/vue.js"></script>
    <script>
        new Vue({//创建一个实例化对象
            el:'#demo',
            data:{
               ok:false 
            }
        })
    </script>
</body>
</html>